本文目的在于复现for循环的运行过程,深究原理.
预计花费时间6min
不要前戏了,直接开始吧
当_calendar未赋值时,无法进行number类型的累加操作,
当为i=n时的an都拼接一个字符串时,比如 "/t"或者"\n",+操作符会把_calendar转化为字符串类型,进行字符串的拼接.
一,单层for()循环 console.log放在for()之内时,
1, number非累和
var _calendar=0;
for (var i = 1; i <=31; i++) {
_calendar=i;
console.log(_calendar);
}
//结果为:
1 //i=1,a1=1;
2 //i=2,a2=2;
3 //i=3,a3=3;
4 //i=4,a4=4;
...
31//i=31,a31=31;
2, number累和
var _calendar=0;
for (var i = 1; i <=31; i++) {
_calendar+=i;
console.log(_calendar);
}
结果为:
1 //i=1,a1=1, sum1=a1;或者理解为sum1=sum的初始值0+a1
3 //i=2,a2=2, sum2=a1+a2=1+2=3;或者理解为sum2=sum1+a2
6 //i=3,a3=3, sum3=a1+a2+a3=1+2+3=6;或者理解为sum3=sum2+a3
10 //i=4,a4=4, sum4=a1+a2+a3+a4=1+2+3+4=10;或者理解为sum4=sum3+a4
...
496 //i=31,a31=31.sum31=496;
3,String非拼接
var _calendar="";
for (var i = 1; i <=31; i++) {
_calendar="i";
console.log(_calendar);
}
结果为:
i
i
i
i
4,String拼接
var _calendar="";
for (var i = 1; i <=31; i++) {
// console.log("i="+i);
_calendar+="i";
console.log(_calendar);
}
结果为:
i//i=1,a1=i sum1=i sum1 的初始值+a1;(""+i)
ii //i=2,a2=i sum2=ii sum2=sum1拼接a2,等价于a1+a2(i+i)
iii //i=3,a3=i sum3=iii sum3=sum2拼接a3,等价于a1+a2+a3(i+i+i)
iiii //i=4,a4=i sum4=****,sum4=sum1拼接a2,等价于a1+a2(i+i+i+i)
...
iiiii...iiii //i=31,a31=i,sum31=a1+a2+a3+...+a31
二, 单层for循环,console.log放在for()之外时,
1, number非累和
var _calendar=0;
for (var i = 1; i <=31; i++) {
_calendar=i;
}
console.log(_calendar);
结果为:
31//i=31,a31=31;
2, number累和
var _calendar=0;
for (var i = 1; i <=31; i++) {
_calendar+=i;
}
console.log(_calendar);
结果为:
496 //i=31,a31=31.sum31=1+2+3+4+...+31=496;
3,String非拼接
var _calendar="";
for (var i = 1; i <=31; i++) {
_calendar = "i";
}
console.log(_calendar);
结果为:
i //i=31,a31=i.
4,String拼接
var _calendar="";
for (var i = 1; i <=31; i++) {
_calendar+="i";
}
console.log(_calendar);
结果为:
iiiiii...i(31个i) //i=31,a31=i sum31=iiiii...ii(31个i)
三 两层for循环时,number累和 非累和
1,number非累和 在内层循环体内打印时,
var _calendar=0;
for(var j=0;j<2;j++){
for (var i = 1; i <=31; i++) {
_calendar=i;
console.log(_calendar);
}
}
结果为:
1
2
...
31
1
2
...
31
2,number非累和,在内层循环体外打印时
var _calendar=0;
for(var j=0;j<2;j++){
for (var i = 1; i <=31; i++) {
_calendar=i;
}
console.log(_calendar);
}
结果为:
31
31
3,number非累和,在外层循环体外打印时
var _calendar=0;
for(var j=0;j<2;j++){
for (var i = 1; i <=31; i++) {
_calendar=i;
}
}
console.log(_calendar);
结果为:
31
4,number累和,在内层循环体内打印时
var _calendar=0;
for(var j=0;j<2;j++){
for (var i = 1; i <=31; i++) {
console.log("j="+j,"i="+i);
_calendar+=i;
console.log(_calendar);
}
}
结果为:
j=0 i=1 1
j=0 i=2 3
...
j=0 i=31 496
j=1 i=1 497
...
j=1 i=31 992
5,number累和,在内层循环体外打印时
var _calendar=0;
for(var j=0;j<2;j++){
for (var i = 1; i <=31; i++) {
console.log("j="+j,"i="+i);
_calendar+=i;
}
console.log(_calendar);
}
结果为:
496 //j=0,i=31
992 //j=1,i=31
6,number累和,在外层循环体外打印时
var _calendar=0;
for(var j=0;j<2;j++){
for (var i = 1; i <=31; i++) {
// console.log("j="+j,"i="+i);
_calendar+=i;
}
}
console.log(_calendar);
结果为:
992 //j=1,i=31
四 两层for循环时,String拼接与非拼接
1,String非拼接,在内层循环体内打印时
var _calendar="";
for(var j=0;j<2;j++){
for (var i = 1; i <=31; i++) {
// console.log("j="+j,"i="+i);
_calendar="i";
console.log(_calendar);
}
}
结果为:
i
i
...
i(共62个)
2,String非拼接,在内层循环体外打印时
var _calendar="";
for(var j=0;j<2;j++){
for (var i = 1; i <=31; i++) {
// console.log("j="+j,"i="+i);
_calendar="i";
}
console.log(_calendar);
}
结果为:
i //j=0,i=31
i //j=1,i=31
3,String非拼接,在外层循环体外打印时
var _calendar="";
for(var j=0;j<2;j++){
for (var i = 1; i <=31; i++) {
console.log("j="+j,"i="+i);
_calendar="i";
}
}
console.log(_calendar);
结果为:
i //j=1,i=31
4,String拼接,在内层循环体内打印时
var _calendar="";
for(var j=0;j<2;j++){
for (var i = 1; i <=31; i++) {
console.log("j="+j,"i="+i);
_calendar+="i";
console.log(_calendar);
}
}
结果为:
i //j=0,i=1
ii //j=0,i=2
...
iii(31个) //j=0, i=31
iii(32个) //j=1,i=1
...
iiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii(自己数一数是不是62个) //j=1,i=31
5,String拼接,在内层循环体外打印时
var _calendar="";
for(var j=0;j<2;j++){
for (var i = 1; i <=31; i++) {
console.log("j="+j,"i="+i);
_calendar+="i";
}
console.log(_calendar);
}
结果为:
iiiiiiiiiiiiiiiiiiiiiiiiiiiiiii //j=0 i=31
iiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii //j=1 i=31
5,String拼接,在外层循环体外打印时
var _calendar="";
for(var j=0;j<2;j++){
for (var i = 1; i <=31; i++) {
console.log("j="+j,"i="+i);
_calendar+="i";
}
}
console.log(_calendar);
结果为:
iiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii //j=1 i=31
补充:以上都是把var _calendar声明赋值在循环体外,研究下在不同位置声明有什么区别?那么我们以String拼接,在内层循环体内打印时为例子.
在内层for循环之外声明:
for(var j=0;j<2;j++){
var _calendar="";//注意这个的位置
for (var i = 1; i <=31; i++) {
console.log("j="+j,"i="+i);
_calendar+="i";
console.log(_calendar);
}
}
结果为:
i //j=0,i=1
ii // j=0,i=2
...
iiiiiiiiiiiiiiiiiiiiiiiiiiiiiii //j=0,i=31
i //j=1,i=1
ii //j=1,i=2
...
iiiiiiiiiiiiiiiiiiiiiiiiiiiiiii //j=1 i=31
在内层for循环之内声明:
1在内层最顶端声明并赋值
for(var j=0;j<2;j++){
for (var i = 1; i <=31; i++) {
var _calendar="";
console.log("j="+j,"i="+i);
_calendar+="i";
console.log(_calendar);
}
}
结果为:
i
i
i
...
i
2在内层最底端赋值(非严格模式下的声明提升问题)
for(var j=0;j<2;j++){
for (var i = 1; i <=31; i++) {
console.log("j="+j,"i="+i);
_calendar+="i";
console.log(_calendar);
var _calendar="";
}
}
结果为:
undefinedi //j=0,i=1 ,因为累加操作的初始化值typeof为undefined
i //j=0 i=2
五,既有Number累和又有String拼接
var _calendar="";
for(var j=0;j<2;j++){
for (var i = 1; i <=31; i++) {
console.log("j="+j,"i="+i);
_calendar+=i+"i";
console.log(_calendar);
}
}
结果为:
1i //j=0 i=1
1i2i //j=0 i=2
...
1i2i3i4i5i6i7i8i9i10i11i12i13i14i15i16i17i18i19i20i21i22i23i24i25i26i27i28i29i30i31i //j=0 i=31
1i2i3i4i5i6i7i8i9i10i11i12i13i14i15i16i17i18i19i20i21i22i23i24i25i26i27i28i29i30i31i1i2i3i4i5i6i7i8i9i10i11i12i13i14i15i16i17i18i19i20i21i22i23i24i25i26i27i28i29i30i31i //j=1 i=31
当number与字符串进行+运算时,会把number转为字符串进行字符串的拼接,并且不再进行number之间的累和运算
